<template>
	<view>
		<cover-view v-if="show" class="privacyNumContact_mask">
			<cover-view class="mask_top2" :style="{'padding-top':statusBarHeight+'px','background-color':mapType?'rgba(0,0,0,0.3)':''}"></cover-view>
			<cover-view class="privacyNumContact_box">
				<cover-image class="privacyNumContact_cancel" @click="cancel"
					src="../../static/images/pulice/icon_cancel_c.png"
					mode=""></cover-image>
				<cover-image class="privacyNumContact_phone_icon"
					src="../../static/images/pulice/wms_phone_icon.png"
					mode=""></cover-image>
				<cover-view class="privacyNumContact_title">
					请确认本机呼出号码
				</cover-view>
				<cover-view class="privacyNumContact_phone">
					{{callPhone}}
				</cover-view>
				<cover-view class="privacyNumContact_remark">
					本机呼出号码与该号码需一致, 否则将呼叫失败
				</cover-view>
				<cover-view class="privacyNumContact_remark">
					为保障服务质量，您的通话可能会被录音
				</cover-view>
				<cover-view class="privacyNumContact_btn">
					<cover-view  @click="clickGetPhone" class="privacyNumContact_btn_wz">
						确认并呼叫(加密)
					</cover-view>
				</cover-view>
				<cover-view class="privacyNumContact_upphone" @click="clickUpPhoneShow">
					不是本机呼出号码，去修改 >
				</cover-view>
			</cover-view>
		</cover-view>
		<view v-else-if="upPhoneShow" class="upPhone" @touchmove.prevent>
			<cover-view class="mask_top" :style="{'padding-top':statusBarHeight+'px','background-color':mapType?'rgba(0,0,0,0.3)':''}"></cover-view>
			<view class="upPhone_popup">
				<image class="privacyNumContact_cancel" @click="UpPhoneCancel"
					src="../../static/images/pulice/icon_cancel_c.png"
					mode=""></image>
				<view class="upPhone_popup_title">
					修改为本机呼出号码
				</view>
				<u--input
					v-model="newPhone"
					style="width: 432rpx;margin: 15rpx 0 11rpx;"
				    fontSize="40rpx"
					color="#333333"
					placeholder="请输入本机呼出号码"
				    border="bottom"
					placeholderStyle="color:#AAAAAA;font-size:40rpx;text-align: center;"
				    clearable
				  ></u--input>
				<view class="privacyNumContact_remark">
					本机呼出号码与该号码需一致, 否则将呼叫失败
				</view>
				<view class="privacyNumContact_remark">
					为保障服务质量，您的通话可能会被录音
				</view>
				<view @click="clickGetPhone" class="upPhone_popup_btn" :class="true?'upPhone_popup_btn_h':''">
					立即呼叫(加密)
				</view>
			</view>
		</view>
	</view>


	<u-toast ref="uToast"></u-toast>
</template>

<script setup>
	/**
	 * show    控制模态框是否显示
	 * callPhone   拨打电话使用的手机号
	 * mapType  是否有地图  没有地图可以将修改拨打电话上方模态框的透明度设置为0
	 *
	 * @cancel  关闭模态框的方法
	 *
	 **/

	import {
		ref,
		defineProps,
		defineEmits,
		getCurrentInstance
	} from 'vue'
	import { getPhone } from '../../../src/utlis/interface/orderDlatils'

	const {
		proxy
	} = getCurrentInstance()

	const props = defineProps(['show', 'callPhone','orderId','type','mapType','phoneBtnList'])
	const emits = defineEmits(['cancel'])

	const statusBarHeight = ref(uni.getSystemInfoSync().statusBarHeight)
	const upPhoneShow = ref(false)//控制修改拨打手机号
	const newPhone = ref("");//修改过的手机号
	const checkPhone = (phoneData) => {
	  // 检查传入的单个电话号码是否有效
	  if (!/^\d+$/.test(phoneData.phone) || phoneData.phone.includes('****')) {
	    console.log(`无效的电话号码或包含 '****' 的电话号码: ${phoneData.phone}`);
	    return false;
	  }

	  // 电话号码有效
	  console.log("电话号码有效");
	  return true;
	};
	// 点击拨打电话
	const clickGetPhone = () => {
		let par = {
			orderId: props.orderId,
			type: props.type,//R-B 表示骑手给商家，R-C 骑手给用户， R-C1 R-C2 跑腿订单 C1 C2：表示帮我取帮我送用户电话
			callPhone: upPhoneShow.value?newPhone.value:props.callPhone,//拨打人电话
			def:!upPhoneShow.value,
		}
    //console.log(props.type);
    //console.log(props.phoneBtnList);
    const map = new Map();
    props.phoneBtnList.forEach((value, index) => {
      map.set(value.type, value); // 将元素作为键，索引作为值
    });

    //console.log(map);
    let b = props.type.split('-')[1];
    let bInfo = map.get(b);
    if (map.get(b) != null) {
      const isValid = checkPhone(bInfo);
      if(isValid){
        uni.makePhoneCall({
          phoneNumber: bInfo.phone * 1
        });
      }else{
        getPhone(par, proxy).then(res => {
          console.log("隐私号成功", res)
          uni.makePhoneCall({
            phoneNumber: res.data.phone
          });

          upPhoneShow.value = false
          newPhone.value = ""
          cancel()
        }).catch(err=>{
          upPhoneShow.value = false
          newPhone.value = ""
          cancel()
          console.log("隐私号拨打电话err",err)
        })
      }
    }

	// if(props.type=='R-B'){
	// 		const isValid = checkPhone(props.phoneBtnList[0]);
	// 		if(isValid){
	// 			uni.makePhoneCall({
	// 				phoneNumber: props.phoneBtnList[0].phone *1
	// 			});
	// 		}else{
	// 				getPhone(par, proxy).then(res => {
	// 					console.log("隐私号成功", res)
	// 					uni.makePhoneCall({
	// 						phoneNumber: res.data.phone
	// 					});
  //
	// 					upPhoneShow.value = false
	// 					newPhone.value = ""
	// 					cancel()
	// 				}).catch(err=>{
	// 					upPhoneShow.value = false
	// 					newPhone.value = ""
	// 					cancel()
	// 					console.log("隐私号拨打电话err",err)
	// 				})
	// 		}
  //
	// 		}else if(props.type=='R-C'){
	// 			const isValid = checkPhone(props.phoneBtnList[1]);
	// 			if(isValid){
	// 				uni.makePhoneCall({
	// 					phoneNumber: props.phoneBtnList[1].phone *1
	// 				});
	// 			}else{
	// 					getPhone(par, proxy).then(res => {
	// 						console.log("隐私号成功", res)
	// 						uni.makePhoneCall({
	// 							phoneNumber: res.data.phone
	// 						});
  //
	// 						upPhoneShow.value = false
	// 						newPhone.value = ""
	// 						cancel()
	// 					}).catch(err=>{
	// 						upPhoneShow.value = false
	// 						newPhone.value = ""
	// 						cancel()
	// 						console.log("隐私号拨打电话err",err)
	// 					})
	// 			}
  //
	// 		}else{
	// 			const isValid = checkPhone(props.phoneBtnList[2]);
	// 			if(isValid){
	// 				uni.makePhoneCall({
	// 					phoneNumber: props.phoneBtnList[2].phone *1
	// 				});
	// 			}else{
	// 					getPhone(par, proxy).then(res => {
	// 						console.log("隐私号成功", res)
	// 						uni.makePhoneCall({
	// 							phoneNumber: res.data.phone
	// 						});
  //
	// 						upPhoneShow.value = false
	// 						newPhone.value = ""
	// 						cancel()
	// 					}).catch(err=>{
	// 						upPhoneShow.value = false
	// 						newPhone.value = ""
	// 						cancel()
	// 						console.log("隐私号拨打电话err",err)
	// 					})
	// 			}
  //
	// 		}
			cancel()


		// 	getPhone(par, proxy).then(res => {
		// 		console.log("隐私号成功", res)
		// 		uni.makePhoneCall({
		// 			phoneNumber: res.data.phone
		// 		});

		// 		upPhoneShow.value = false
		// 		newPhone.value = ""
		// 		cancel()
		// 	}).catch(err=>{
		// 		upPhoneShow.value = false
		// 		newPhone.value = ""
		// 		cancel()
		// 		console.log("隐私号拨打电话err",err)
		// 	})


	}

	// 点击修改拨打电话
	const clickUpPhoneShow = () =>{
		upPhoneShow.value = true
		cancel()
	}

	const UpPhoneCancel = () =>{
		upPhoneShow.value = false
		newPhone.value = ""

		emits('cancel')
	}

	// 点击关闭按钮
	const cancel = () => {
		emits('cancel')
	}
</script>

<style scoped lang="scss">
	.privacyNumContact_mask {
		width: 100%;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		z-index: 10000;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: rgba(0, 0, 0, 0.3);
	}

	.privacyNumContact_box {
		position: relative;
		width: 500rpx;
		height: 630rpx;
		background-color: #fff;
		border-radius: 30rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		box-sizing: border-box;
		padding: 34rpx 0;
	}

	.privacyNumContact_cancel {
		width: 38rpx;
		height: 38rpx;
		position: absolute;
		top: 20rpx;
		right: 20rpx;
	}

	.privacyNumContact_phone_icon {
		width: 169rpx;
		height: 220rpx;
		object-fit: cover;
	}

	.privacyNumContact_title {
		width: 100%;
		text-align: center;
		font-size: 30rpx;
		font-weight: bold;
		line-height: 42rpx;
		color: #333333;
		margin-top: 34rpx;
	}

	.privacyNumContact_phone {
		font-size: 40rpx;
		line-height: 50rpx;
		font-weight: bold;
		color: #333333;
		margin-bottom: 10rpx;
	}

	.privacyNumContact_remark {
		font-size: 22rpx;
		line-height: 28rpx;
		color: #ff0000;
	}

	.privacyNumContact_btn {
		width: 300rpx;
		height: 60rpx;
		position: relative;
		border-radius: 60rpx;
		margin: 39rpx auto 18rpx;
		background-color: #FF1B1B;
		color: #fff;
		font-size: 30rpx;
		box-sizing: border-box;
		position: relative;
	}

	.privacyNumContact_btn_wz {
		width: 100%;
		text-align: center;
		position: absolute;
		top: 50%;
		left: 0;
		transform: translate(0, -50%);
		font-size: 30rpx;
	}

	.privacyNumContact_upphone {
		width: 100%;
		color: #777777;
		font-size: 24rpx;
		text-align: center;
	}

	.upPhone {
		z-index: 10000;
		width: 100%;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		background-color: rgba(0, 0, 0, 0.3);
	}

	.mask_top2{
		height: 620rpx;
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	.mask_top {
		height: 620rpx;
		width: 100%;
	}

	.upPhone_popup {
		position: relative;
		width: 500rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 0 auto;
		box-sizing: border-box;
		padding: 42rpx 0;
		background-color: #fff;
		border-radius: 30rpx;
	}

	.upPhone_popup_title{
		font-size: 30rpx;
		line-height: 42rpx;
		font-weight: bold;
		color: #333333;
	}


	.upPhone_popup_btn{
		width: 380rpx;
		height: 60rpx;
		font-size: 30rpx;
		color: #777777;
		background-color: #EFEFEF;
		border-radius: 60rpx;
		margin: 39rpx auto 18rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.upPhone_popup_btn_h{
		background-color: #FF1B1B;
		color: #fff;
	}
</style>
